(function(factory) {
	if(typeof define === "function" && define.amd) {
		// AMD. Register as an anonymous module.
		define(['HteOS/metro/Tile'],factory);
	} else {
		// Browser globals
		factory();
	}
}(function() {
	/***
	 * 桌面应用分组
	 * @class HteOS.metro.Group
	 * */
	var Group = HteOS.metro.Group = function(group) {
		this.group = group;
	};

	/**
	 * @private
	 * 渲染分组到容器中，创建分组的DOM，并将分组下的所有应用渲染到分组的DOM中。
	 * 创建分组名称编辑组件，并开启分组拖拽组件
	 * @param {Object}
	 * */
	Group.prototype.render = function(container) {
		var group = this;
		var el = $("<div id=\"hte-metro-group-" + this.group.id + "\" class=\"hte-metro-group\" data-index='" + this.group.index + "' data-group='"+ this.group.id +"'>" +
			"<div class=\"hte-metro-group-title\">" +
			"<input type='text' class='hte-metro-group-title-editor form-control'>" +
			"<span class='hte-metro-group-title-name'>" + this.group.name + "</span>" +
			"</div>" +
			"</div>");
		var hook = $(".hte-metro-hook");
		if(hook.length > 0) {
			el.insertBefore(hook);
		} else {
			el.appendTo($(".hte-metro-inner"));
		}
		//el.attr("data-groupId", this.id);
		this.el = el;
		
		this.initEditor();
		
		var apps = this.group.apps;
		if(apps) {
			var array = [];
			HteOS.each(apps,function(app,id){
				array.push(app);
			})
			/*for(var id in apps) {
				array.push(apps[id]);
			}*/
			array.sort(function(a, b) {
				if(a.index > b.index) {
					return 1;
				}
				return -1;
			});
			/*for(var i = 0; i < array.length; i++) {
				var app = array[i];
				el.append(app.render());
			}*/
			array.forEach(function(app,index){
				el.append(HteOS.metro.View.createTile(app));
			});
		}
		this.draggable();
		this.droppable();
		el.appendTo(container);
		this.rendered = true;
		this.group.rendered = true;
	};
	
	/**
	 * @private 创建分组名称编辑组件
	 * */
	Group.prototype.initEditor  = function(){
		var group = this,el = group.el;
		var editor = el.find(".hte-metro-group-title-editor");
		editor.blur(function() {
			group.group.setName(editor.val());
			editor.hide();
		});
		editor.keyup(function(event) {
			if(event.keyCode == 13) {
				group.group.setName(editor.val());
				editor.hide();
			} else if(event.keyCode == 27) {
				editor.hide();
			}
		});

		el.find(".hte-metro-group-title").click(function() {
			editor.val(group.group.name);
			editor.show();
			editor.focus();
			editor.select();
		});
	};
	/**
	 * 设置分组名称，设置成功后触发名称更改事件
	 * @param {String} name
	 * */
	Group.prototype.setName = function(name) {
		this.el.find(".hte-metro-group-title-name").text(name);
	};

	/**
	 * @private 销毁分组，并将分组的DOM删除
	 * */
	Group.prototype.destroy = function() {
		this.el.remove();
		this.el = null;
	};

	/**
	 * 添加App，调用insert方法，插入应用到最后面  HteOS.app.Group.insert
	 * @param {HteOS.app.App} app
	 * */
	Group.prototype.add = function(app) {
		this.insert(app);
	};

	/**
	 * 获取分组中应用的数量
	 * @return {Number} 应用的数量
	 * */
	Group.prototype.length = function() {
		return this.el.find(".hte-tile").length;
	};

	/**
	 * 通过位置获取App
	 * @param {Number} index
	 * @return {Object} 指定位置的应用
	 **/
	Group.prototype.getAt = function(index) {
		return this.el.find(".hte-tile").eq(index);
	};


	/**
	 * 添加到App到指定的位置，如果没有制定位置则默认插入到最后面，并对App的DOM进行位置调整
	 * 添加成功之后如果分组已经渲染则会触发hte-group-apps-change事件
	 * @param {HteOS.app.App} app 要添加的应用
	 * @param {Number} index 指定添加的位置
	 * */
	Group.prototype.insert = function(tile, index) {
		var el = this.el,tileEl = tile.getEl();
		if(index == 0) {
			tileEl.insertAfter(el.find(".hte-metro-group-title "));
		} else if(index < this.length()) {
			var target = this.getAt(index);
			tileEl.insertBefore(target);
		} else {
			tileEl.appendTo(el);
		}
	};

	/**
	 * @private
	 * 启动分组拖拽
	 * */
	Group.prototype.draggable = function() {
		var el = this.el,
			$el = HteOS.Metro.getEl();
		el.draggable({
			handle: ".hte-metro-group-title",
			containment: $el,
			scroll: true,
			revert: false,
			helper: function() {
				var source = $("<div class='hte-metro-group-dd-proxy'></div>");
				source.appendTo($el);
				return source;
			},
			start: function(event, ui) {
				$el.addClass("hte-metro-dragging");
				$(this).css("visibility", "hidden");
			},
			stop: function(event, ui) {
				$el.removeClass("hte-metro-dragging");
				$(this).css("visibility", "visible");
				HteOS.metro.View.sortGroup();
			}
		});
	};

	/**
	 * @private 
	 * 启动磁贴拖拽放下后的动作
	 * */
	Group.prototype.droppable = function() {
		var el = this.el,
			$el = HteOS.Metro.getEl();
		el.droppable({
			accept: ".hte-metro-group",
			over: function(event, ui) {
				var target = $(this);
				var source = $(ui.draggable.get(0));
				var offset1 = target.offset();
				var offset2 = source.offset();
				if(offset2.top > offset1.top) {
					source.insertAfter(target);
				} else if(offset1.top = offset2.top) {
					if(offset1.left > offset2.left) {
						source.insertAfter(target);
					} else {
						source.insertBefore(target);
					}
				} else {
					source.insertBefore(target);
				}
			}
		});
	};

	/**
	 * 获取分组的DOM
	 * */
	Group.prototype.getEl = function() {
		return this.el;
	};
}));